﻿<form:Form xmlns:my="clr-namespace:VAdvantage.KnowledgeBase"
           xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"  
           x:Class="VAdvantage.KnowledgeBase.Topic" 
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
           mc:Ignorable="d" xmlns:form="clr-namespace:SilverlightDesktop.Controls;assembly=SilverlightDesktop"
           xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           xmlns:controls="clr-namespace:VAdvantage.Controls"
           
           d:DesignWidth="700" d:DesignHeight="500"
            FormStyle="None" ShowInTaskBar="False" ResizeMode="NoResize" FormBorderColor="#FFB7C8D3" FormBorderThickness="0">
    <Grid x:Name="LayoutRoot"  Background="#cee1f1">
        <Grid.Resources>

            <LinearGradientBrush x:Key="buttBackBrush" StartPoint="0,0" EndPoint="0,1" >
                <GradientStop Color="#FFFFFFFF" Offset="0"/>
                <GradientStop Color="#FFFFFFFF" Offset="1"/>
            </LinearGradientBrush>

            <Style TargetType="CheckBox" x:Key="RoundCheckBoxStyle">
                <Setter Property="Height" Value="26"/>
                <Setter Property="Width" Value="Auto"/>
                <Setter Property="Padding" Value="12,2,12,2"></Setter>
                <Setter Property="Background" Value="{StaticResource buttBackBrush}" />
                <Setter Property="HorizontalContentAlignment" Value="Center"/>
                <Setter Property="VerticalContentAlignment" Value="Center"/>
                <Setter Property="FontSize" Value="10"/>

                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="CheckBox">
                            <Grid>
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Normal"/>
                                        <VisualState x:Name="MouseOver">
                                            <Storyboard>
                                                <DoubleAnimation Duration="0" Storyboard.TargetName="brd" Storyboard.TargetProperty="Opacity" To="0.15"/>
                                                <!--<ColorAnimation Duration="0" Storyboard.TargetName="MouseOverGradient" Storyboard.TargetProperty="(GradientBrush.GradientStops)[0].(GradientStop.Color)" To="#FFAAAAAA"/>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="MouseOverGradient" Storyboard.TargetProperty="(GradientBrush.GradientStops)[1].(GradientStop.Color)" To="#FFCCCCCC"/>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="MouseOverGradient" Storyboard.TargetProperty="(GradientBrush.GradientStops)[2].(GradientStop.Color)" To="#EEEEEEEE"/>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="MouseOverGradient" Storyboard.TargetProperty="(GradientBrush.GradientStops)[3].(GradientStop.Color)" To="#FFFFFFFF"/>-->
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="CheckStates">
                                        <VisualState x:Name="Checked">
                                            <Storyboard>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(GradientBrush.GradientStops)[0].(GradientStop.Color)" To="#FF0084c4"/>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(GradientBrush.GradientStops)[1].(GradientStop.Color)" To="#FF0084c4"/>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="brd" Storyboard.TargetProperty="(BorderBrush).(SolidColorBrush.Color)" To="#FF9CCAE7"/>
                                                <ColorAnimation Duration="0" Storyboard.TargetName ="contentControl"   Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" To="#FFFFFFFF"/>

                                                <!--<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(GradientBrush.GradientStops)[2].(GradientStop.Color)" To="#FFFFFFFF"/>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(GradientBrush.GradientStops)[3].(GradientStop.Color)" To="#FFFFFFFF"/>-->
                                            </Storyboard>

                                        </VisualState>
                                        <VisualState x:Name="Unchecked">
                                        </VisualState>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>

                                <Border CornerRadius="3" BorderThickness="1" BorderBrush="#FF9CCAE7" >
                                    <Border.Background>
                                        <LinearGradientBrush x:Name="mouseOverGradient" StartPoint="0,0" EndPoint="0,1" >
                                            <GradientStop Color="#FFFFE5E5" Offset="0" />
                                            <GradientStop Color="#FF0084C4" Offset="1" />
                                        </LinearGradientBrush>
                                    </Border.Background>

                                </Border>

                                <Border Name="brd" BorderThickness="1" BorderBrush="#FFFFFFFF" CornerRadius="3">
                                    <Border.Background>
                                        <LinearGradientBrush x:Name="BackgroundGradient" StartPoint="0,0" EndPoint="0,1" >
                                            <GradientStop Color="#FFFFFFFF" Offset="0"/>
                                            <GradientStop Color="#FFFFFFFF" Offset="1"/>

                                        </LinearGradientBrush>
                                    </Border.Background>
                                </Border>
                                <!--<Border BorderThickness="0,0,1,0" Margin="0,3" 
								  BorderBrush="{StaticResource commandBaseBorderBrush}"/>-->
                                <ContentControl x:Name="contentControl" VerticalContentAlignment="Center">
                                    <ContentPresenter
                                x:Name="contentPresenter"
                                Content="{TemplateBinding Content}"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                Margin="{TemplateBinding Padding}" ></ContentPresenter>
                                </ContentControl>

                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
        </Grid.RowDefinitions>

        <Grid x:Name="grdTopic" Margin="9">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition></RowDefinition>
                <RowDefinition Height="40"></RowDefinition>
            </Grid.RowDefinitions>
            <Image Source="../Images/logoLogin.png" HorizontalAlignment="Left" VerticalAlignment="Top" Height="40" Width="120" Stretch="Fill"></Image>
            <Grid Grid.Row="1">
                <Grid.ColumnDefinitions >
                    <ColumnDefinition Width="*"></ColumnDefinition>
                    <ColumnDefinition Width="150"></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" ></RowDefinition>
                    <RowDefinition Height="Auto" ></RowDefinition>
                    <RowDefinition Height="*"></RowDefinition>
                </Grid.RowDefinitions>
                <Grid Margin="0,9,0,9">

                    <TextBlock Text="Getting Started" FontSize="20" FontWeight="Medium"  VerticalAlignment="Top" ></TextBlock>
                    <Grid HorizontalAlignment="Right" VerticalAlignment="Top" Height="25" Margin="0,0,4,0">
                        <Border CornerRadius="15" Background="White" BorderBrush="#cbcbcb" BorderThickness="1">
                            <Grid Margin="1">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                                </Grid.ColumnDefinitions>
                                <controls:VComboBox Margin="5,0,-2,0" x:Name="cmbSearch" Background="White" BorderThickness="0" Width="120"  BorderBrush="{x:Null}" />
                                <Rectangle Margin="0,0,5,0" Grid.Column="1" Width="1" Fill="Gray"></Rectangle>
                                <Image Margin="0,0,3,0" Grid.Column="2" Source="../Images/search.png" Width="18" Height="18" Stretch="Fill"></Image>
                            </Grid>
                        </Border>
                    </Grid>
                </Grid>
                <Grid Grid.Row="1" x:Name="grdTab">
                    <!--tabs-->
                    <StackPanel Margin="0,0,0,3" Orientation="Horizontal">
                        <CheckBox Content="Topic" Margin="1,0,1,0" IsChecked="True" Style="{StaticResource RoundCheckBoxStyle}" ></CheckBox>
                        <CheckBox Content="Email" Margin="1,0,1,0" Style="{StaticResource RoundCheckBoxStyle}"></CheckBox>

                    </StackPanel>
                    <Rectangle Height="3" VerticalAlignment="Bottom" Fill="#bad4ea"></Rectangle>
                    <Image Source="../Images/Toolbar/Multi22.png" x:Name="imgToogle" MouseLeftButtonUp="Image_MouseLeftButtonUp" Width="25" Height="25" HorizontalAlignment="Right"></Image>
                </Grid>
                <Grid Grid.Row="2" Margin="0,2,0,0">
                    <!--grids-->
                    <Grid x:Name="grdTabular" Visibility="Collapsed">
                        <ScrollViewer HorizontalAlignment="Stretch" Margin="0" Padding="0" BorderThickness="0" HorizontalScrollBarVisibility="Disabled">
                            <toolkit:WrapPanel x:Name="stTabular" Orientation="Horizontal">
                            </toolkit:WrapPanel>
                        </ScrollViewer>
                    </Grid>
                    <Grid x:Name="grdDetail">
                        <ListBox x:Name="lstGrid" Background="Transparent" BorderThickness="0" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <Grid Loaded="Grid_Loaded">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto"/>
                                            <ColumnDefinition Width="*"/>
                                        </Grid.ColumnDefinitions>
                                        <StackPanel Orientation="Vertical" Margin="0">
                                            <Image Source="{Binding Icon}" VerticalAlignment="Top" Stretch="Fill" HorizontalAlignment="Left" Height="100" Width="150"  Margin="0" />
                                            <TextBlock  Text="{Binding Name}" Margin="2" Width="Auto" Height="Auto" HorizontalAlignment="Center"  />
                                        </StackPanel>
                                        <Grid Grid.Column="1">
                                            <StackPanel Orientation="Vertical" HorizontalAlignment="Stretch"  Margin="10,0,0,0">
                                                <TextBlock Text="{Binding Desc}"  Margin="0" FontSize="18" FontWeight="SemiBold" HorizontalAlignment="Left" />
                                                <TextBlock Text="{Binding Help}" Margin="0,10,0,0" TextWrapping="Wrap" HorizontalAlignment="Left" />
                                            </StackPanel>
                                        </Grid>
                                    </Grid>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </Grid>
                </Grid>
            </Grid>
            <Grid Grid.Column="1" x:Name="RightPanel"></Grid>
            <Grid Grid.Row="2" VerticalAlignment="Bottom" Margin="2,2,2,5">
                <CheckBox x:Name="chkWelcome" Content="Show Welcome Screen on StartUp" VerticalAlignment="Center"></CheckBox>
                <controls:ToolBarButton x:Name="btnClose" Click="btnClose_Click"  HorizontalAlignment="Right" Height="30"  IconMargin="8,0,2,0" Text="Close" Icon="../Images/cancel.png" >

                </controls:ToolBarButton>
            </Grid>
        </Grid>
        <Grid x:Name="grdStep" Visibility="Collapsed"  Margin="9">
            <Grid.RowDefinitions>
                <RowDefinition Height="50"></RowDefinition>
                <RowDefinition></RowDefinition>
                <RowDefinition Height="40"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid>
                <TextBlock Text="SetupEmails" x:Name="txtStepHeader" FontSize="20" Foreground="#FF0084c4" FontWeight="Medium" Height="Auto"></TextBlock>
                <Image x:Name="imgSound" Source="../Images/sound.png" Height="20" Width="20" Cursor="Stylus" MouseLeftButtonUp="imgSound_MouseLeftButtonUp"   HorizontalAlignment="Right" VerticalAlignment="Top"></Image>
                <MediaElement x:Name="_audioPlayer"/>
            </Grid>
            <Grid Grid.Row="1" Margin="0,0,5,5">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"></ColumnDefinition>
                    <ColumnDefinition Width="150"></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"></ColumnDefinition>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                        <ColumnDefinition Width="Auto"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <Button x:Name="btnLeftArrow" Grid.Column="0" Grid.Row="0" Margin="10,0,5,0" Click="btnLeftArrow_Click">
                        <Button.Template>
                            <ControlTemplate>
                                <Grid>
                                    <Path  Data="M224,176 C62.521194,242.20894 72.499382,207.5 224,276" Cursor="Hand" VerticalAlignment="Center" HorizontalAlignment="Center"  Stretch="Fill" UseLayoutRounding="False"  Width="9" Height="15"  StrokeThickness="3" Stroke="Black" Grid.Row="1" StrokeDashCap="Round" RenderTransformOrigin="0.5,0.5">
                                        <Path.RenderTransform>
                                            <CompositeTransform Rotation="0" ScaleX="1"/>
                                        </Path.RenderTransform>
                                    </Path>
                                </Grid>
                            </ControlTemplate>
                        </Button.Template>
                    </Button>
                    <my:ImageTextControl x:Name="stepDetail" Click="stepDetail_Click"    Grid.Column="1" Background="Transparent" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
                    <!--<Grid   Grid.Row="0" MouseLeftButtonUp="grdRightArrow_MouseLeftButtonUp">-->
                    <Button Grid.Column="2" x:Name="grdRightArrow"  Margin="5,0,10,0" Click="grdRightArrow_Click" >
                        <Button.Template>
                            <ControlTemplate>
                                <Grid>
                                    <Path  Data="M224,176 C62.521194,242.20894 72.499382,207.5 224,276" Cursor="Hand" VerticalAlignment="Center" HorizontalAlignment="Center"  Stretch="Fill" UseLayoutRounding="False"  Width="9" Height="15"  StrokeThickness="3" Stroke="Black" Grid.Row="1" StrokeDashCap="Round" RenderTransformOrigin="0.5,0.5">
                                        <Path.RenderTransform>
                                            <CompositeTransform Rotation="180" ScaleX="1"/>
                                        </Path.RenderTransform>
                                    </Path>
                                </Grid>
                            </ControlTemplate>
                        </Button.Template>
                        <!--<Rectangle  Fill="Transparent"  Width="20" Height="20" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="2" Grid.Row="1">
                        </Rectangle>-->
                        <!--<Path  Data="M224,176 C62.521194,242.20894 72.499382,207.5 224,276" VerticalAlignment="Center" HorizontalAlignment="Center"  Stretch="Fill" UseLayoutRounding="False"  Width="9" Height="15"  StrokeThickness="3" Stroke="Black" Grid.Row="1" StrokeDashCap="Round" RenderTransformOrigin="0.5,0.5">
                            <Path.RenderTransform>
                                <CompositeTransform Rotation="180" ScaleX="1"/>
                            </Path.RenderTransform>
                        </Path>-->
                    </Button>
                </Grid>
                <Grid Grid.Column="1">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"></RowDefinition>
                        <RowDefinition Height="*"></RowDefinition>
                    </Grid.RowDefinitions>
                        <TextBlock x:Name="txtGoto" Text="GoTo" FontSize="16" Margin="5,0,2,2" FontWeight="Medium" Foreground="#FF0084c4"></TextBlock>
                        <ListBox Grid.Row="1" x:Name="lstStep" SelectionChanged="lstStep_SelectionChanged" Background="#eef8fd" BorderThickness="0">
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <Grid HorizontalAlignment="Stretch">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                                            <ColumnDefinition></ColumnDefinition>
                                        </Grid.ColumnDefinitions>
                                    <Image Source="../Images/arrowElbow.png" Stretch="None" MaxHeight="30" MaxWidth="30" Margin="5,0,5,0" VerticalAlignment="Center" ></Image>
                                        <TextBlock Grid.Column="1" Text="{Binding Name}" VerticalAlignment="Center" HorizontalAlignment="Stretch"></TextBlock>
                                    </Grid>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                   
                </Grid>
            </Grid>
            <Grid Grid.Row="2" VerticalAlignment="Bottom" Margin="2,2,2,5">
                <controls:ToolBarButton x:Name="btnBack2" Click="btnBack2_Click" HorizontalAlignment="Left" Height="30" IconMargin="2,0,0,0" Text="Back" Icon="../Images/arrow-close.png"></controls:ToolBarButton>
                <controls:ToolBarButton x:Name="btnClose2" Click="btnClose2_Click" HorizontalAlignment="Right" Height="30" IconMargin="8,0,2,0" Text="Close" Icon="VAdvantage/component;/Images/cancel.png"></controls:ToolBarButton>
            </Grid>
        </Grid>
        <toolkit:BusyIndicator x:Name="busyIndicator" IsBusy="False" VerticalAlignment="Center" HorizontalAlignment="Center"></toolkit:BusyIndicator> 
    </Grid>
</form:Form>
